<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>题库管理系统</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        }

        body {
            background-color: #f5f7fa;
            color: #333;
            line-height: 1.6;
        }

        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 20px;
        }

        header {
            background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%);
            color: white;
            padding: 20px 0;
            border-radius: 10px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
            margin-bottom: 30px;
        }

        .header-content {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 20px;
        }

        .logo {
            font-size: 24px;
            font-weight: bold;
            display: flex;
            align-items: center;
        }

        .logo i {
            margin-right: 10px;
            font-size: 28px;
        }

        .tech-selector {
            display: flex;
            gap: 15px;
        }

        .tech-btn {
            background: rgba(255, 255, 255, 0.2);
            border: none;
            padding: 10px 20px;
            border-radius: 30px;
            color: white;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .tech-btn:hover {
            background: rgba(255, 255, 255, 0.3);
        }

        .tech-btn.active {
            background: white;
            color: #6a11cb;
        }

        .main-content {
            display: flex;
            gap: 30px;
        }

        .sidebar {
            flex: 0 0 250px;
            background: white;
            border-radius: 10px;
            padding: 20px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
        }

        .question-type {
            list-style: none;
            margin-top: 20px;
        }

        .question-type li {
            padding: 15px;
            border-radius: 8px;
            margin-bottom: 10px;
            cursor: pointer;
            display: flex;
            align-items: center;
            transition: all 0.3s ease;
        }

        .question-type li:hover {
            background: #f0f5ff;
        }

        .question-type li.active {
            background: #e6f0ff;
            color: #2575fc;
            font-weight: 600;
        }

        .question-type i {
            margin-right: 10px;
            font-size: 18px;
        }

        .content-area {
            flex: 1;
            background: white;
            border-radius: 10px;
            padding: 25px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
        }

        .content-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 25px;
            padding-bottom: 15px;
            border-bottom: 1px solid #eee;
        }

        .question-count {
            font-size: 18px;
            font-weight: 600;
            color: #2575fc;
        }

        .question-nav {
            display: flex;
            gap: 10px;
        }

        .nav-btn {
            background: #f0f5ff;
            border: none;
            padding: 8px 15px;
            border-radius: 5px;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .nav-btn:hover {
            background: #e0ebff;
        }

        .nav-btn:disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }

        .question-card {
            margin-bottom: 25px;
            padding: 20px;
            border-radius: 10px;
            background: #fafbff;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03);
        }

        .question-title {
            font-size: 18px;
            margin-bottom: 15px;
            font-weight: 600;
            color: #2c3e50;
        }

        .options {
            list-style: none;
            margin-bottom: 20px;
        }

        .options li {
            padding: 12px 15px;
            background: white;
            border: 1px solid #eaeaea;
            border-radius: 8px;
            margin-bottom: 10px;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .options li:hover {
            border-color: #a0c1ff;
        }

        .options li.selected {
            background: #e6f0ff;
            border-color: #2575fc;
        }

        .answer-section {
            background: #f8fff8;
            border-left: 4px solid #4caf50;
            padding: 15px;
            border-radius: 0 8px 8px 0;
            margin-top: 20px;
        }

        .answer-title {
            font-weight: 600;
            color: #4caf50;
            margin-bottom: 10px;
        }

        .explanation {
            color: #555;
        }

        footer {
            text-align: center;
            margin-top: 40px;
            color: #777;
            padding: 20px;
            font-size: 14px;
        }

        @media (max-width: 768px) {
            .main-content {
                flex-direction: column;
            }

            .sidebar {
                flex: 1;
                margin-bottom: 20px;
            }

            .header-content {
                flex-direction: column;
                gap: 15px;
            }

            .tech-selector {
                flex-wrap: wrap;
                justify-content: center;
            }
        }
    </style>
</head>
<body>
<div class="container">
    <header>
        <div class="header-content">
            <div class="logo">
                <i class="fas fa-graduation-cap"></i>
                <span>题库管理系统</span>
            </div>
            <div class="tech-selector">
                <button class="tech-btn active" data-tech="java">Java</button>
                <button class="tech-btn" data-tech="harmony">鸿蒙</button>
                <button class="tech-btn" data-tech="android">Android</button>
            </div>
        </div>
    </header>

    <div class="main-content">
        <div class="sidebar">
            <h3>题型选择</h3>
            <ul class="question-type">
                <li class="active" data-type="single">
                    <i class="fas fa-dot-circle"></i>
                    <span>单选题</span>
                </li>
                <li data-type="multiple">
                    <i class="fas fa-check-square"></i>
                    <span>多选题</span>
                </li>
                <li data-type="judge">
                    <i class="fas fa-check-double"></i>
                    <span>判断题</span>
                </li>
            </ul>
        </div>

        <div class="content-area">
            <div class="content-header">
                <div class="question-count">题目 <span id="current-question">1</span>/<span id="total-questions">10</span></div>
                <div class="question-nav">
                    <button class="nav-btn" id="prev-btn" disabled>上一题</button>
                    <button class="nav-btn" id="next-btn">下一题</button>
                </div>
            </div>

            <div id="question-container">
                <!-- 题目内容将通过JavaScript动态加载 -->
            </div>
        </div>
    </div>

    <footer>
        <p>© 2023 题库管理系统 | 提供Java、鸿蒙、Android相关题目练习</p>
    </footer>
</div>

<script>
    // 题库数据
    const questionBank = {
        java: {
            single: [
                {
                    question: "Java中以下哪个关键字用于实现继承？",
                    options: ["A. implements", "B. extends", "C. inherit", "D. super"],
                    answer: "B. extends",
                    explanation: "在Java中，使用extends关键字来实现类与类之间的继承。例如：class SubClass extends SuperClass { }。implements关键字用于实现接口，inherit不是Java关键字，super关键字用于引用父类的成员。"
                },
                {
                    question: "Java中以下哪个不是基本数据类型？",
                    options: ["A. int", "B. boolean", "C. String", "D. double"],
                    answer: "C. String",
                    explanation: "Java的基本数据类型包括：byte、short、int、long、float、double、char和boolean。String是类，不是基本数据类型。"
                },
                {
                    question: "Java中以下哪个关键字用于创建对象实例？",
                    options: ["A. new", "B. class", "C. this", "D. instance"],
                    answer: "A. new",
                    explanation: "在Java中，使用new关键字来创建对象实例。例如：String str = new String(\"hello\");。"
                },
                {
                    question: "Java中以下哪个修饰符表示静态？",
                    options: ["A. final", "B. static", "C. const", "D. volatile"],
                    answer: "B. static",
                    explanation: "static修饰符表示静态的，可以修饰变量、方法和代码块。静态成员属于类，而不是对象实例。"
                },
                {
                    question: "Java中以下哪个包包含集合框架？",
                    options: ["A. java.io", "B. java.util", "C. java.lang", "D. java.net"],
                    answer: "B. java.util",
                    explanation: "Java的集合框架位于java.util包中，包括List、Set、Map等接口和它们的实现类。"
                },
                {
                    question: "Java中以下哪个接口表示键值对集合？",
                    options: ["A. List", "B. Set", "C. Map", "D. Collection"],
                    answer: "C. Map",
                    explanation: "Map接口表示键值对的集合，每个元素包含一个键和一个值，键不能重复。"
                },
                {
                    question: "Java中以下哪个关键字用于处理异常？",
                    options: ["A. exception", "B. error", "C. try", "D. mistake"],
                    answer: "C. try",
                    explanation: "Java中使用try-catch-finally语句来处理异常。try块包含可能抛出异常的代码，catch块用于捕获和处理异常。"
                },
                {
                    question: "Java中以下哪个不是访问修饰符？",
                    options: ["A. public", "B. private", "C. protected", "D. internal"],
                    answer: "D. internal",
                    explanation: "Java的访问修饰符包括：public、protected、private和默认（包级访问）。internal不是Java的访问修饰符，它是C#中的访问修饰符。"
                },
                {
                    question: "Java中以下哪个方法用于启动线程？",
                    options: ["A. run()", "B. start()", "C. execute()", "D. launch()"],
                    answer: "B. start()",
                    explanation: "start()方法用于启动线程，它会调用run()方法。直接调用run()方法不会启动新线程，而是在当前线程中执行。"
                },
                {
                    question: "Java中以下哪个关键字用于定义常量？",
                    options: ["A. const", "B. final", "C. static", "D. constant"],
                    answer: "B. final",
                    explanation: "final关键字用于定义常量，表示一旦赋值就不能再修改。const是Java的保留关键字，但目前没有使用。"
                }
            ],
            multiple: [
                {
                    question: "Java中以下哪些是基本数据类型？（多选）",
                    options: ["A. int", "B. Integer", "C. float", "D. String", "E. boolean"],
                    answer: "A. int, C. float, E. boolean",
                    explanation: "Java的基本数据类型包括：byte、short、int、long、float、double、char和boolean。Integer是int的包装类，String是类。"
                },
                {
                    question: "Java中以下哪些是面向对象的特性？（多选）",
                    options: ["A. 封装", "B. 继承", "C. 多态", "D. 抽象", "E. 泛型"],
                    answer: "A. 封装, B. 继承, C. 多态, D. 抽象",
                    explanation: "面向对象的四大特性是：封装、继承、多态和抽象。泛型是Java的一种编程特性，但不是面向对象的核心特性。"
                },
                {
                    question: "Java中以下哪些集合类实现了List接口？（多选）",
                    options: ["A. ArrayList", "B. HashSet", "C. LinkedList", "D. HashMap", "E. Vector"],
                    answer: "A. ArrayList, C. LinkedList, E. Vector",
                    explanation: "ArrayList、LinkedList和Vector都实现了List接口。HashSet实现了Set接口，HashMap实现了Map接口。"
                },
                {
                    question: "Java中以下哪些关键字可以用于异常处理？（多选）",
                    options: ["A. try", "B. catch", "C. throw", "D. throws", "E. exception"],
                    answer: "A. try, B. catch, C. throw, D. throws",
                    explanation: "try、catch、throw和throws都是Java中用于异常处理的关键字。exception不是关键字，Exception是异常类的基类。"
                },
                {
                    question: "Java中以下哪些是访问修饰符？（多选）",
                    options: ["A. public", "B. private", "C. protected", "D. default", "E. internal"],
                    answer: "A. public, B. private, C. protected, D. default",
                    explanation: "Java的访问修饰符包括：public、protected、private和默认（包级访问）。internal不是Java的访问修饰符。"
                },
                {
                    question: "Java中以下哪些是线程安全的方法？（多选）",
                    options: ["A. StringBuilder", "B. StringBuffer", "C. ArrayList", "D. Vector", "E. HashMap"],
                    answer: "B. StringBuffer, D. Vector",
                    explanation: "StringBuffer和Vector是线程安全的，它们的方法都是同步的。StringBuilder、ArrayList和HashMap不是线程安全的。"
                },
                {
                    question: "Java中以下哪些是合法的标识符？（多选）",
                    options: ["A. _variable", "B. 2variable", "C. $variable", "D. variable-name", "E. variableName"],
                    answer: "A. _variable, C. $variable, E. variableName",
                    explanation: "Java标识符必须以字母、下划线(_)或美元符号($)开头，不能以数字开头，不能包含连字符(-)。"
                },
                {
                    question: "Java中以下哪些是检查型异常？（多选）",
                    options: ["A. IOException", "B. RuntimeException", "C. NullPointerException", "D. SQLException", "E. ClassNotFoundException"],
                    answer: "A. IOException, D. SQLException, E. ClassNotFoundException",
                    explanation: "IOException、SQLException和ClassNotFoundException是检查型异常，必须在代码中处理或声明抛出。RuntimeException和NullPointerException是运行时异常，是非检查型异常。"
                },
                {
                    question: "Java中以下哪些是Java虚拟机的组成部分？（多选）",
                    options: ["A. 类加载器", "B. 执行引擎", "C. 运行时数据区", "D. 本地方法接口", "E. 垃圾回收器"],
                    answer: "A. 类加载器, B. 执行引擎, C. 运行时数据区, D. 本地方法接口, E. 垃圾回收器",
                    explanation: "Java虚拟机的主要组成部分包括：类加载器、执行引擎、运行时数据区、本地方法接口和垃圾回收器。"
                },
                {
                    question: "Java中以下哪些是合法的循环结构？（多选）",
                    options: ["A. for", "B. while", "C. do-while", "D. foreach", "E. loop"],
                    answer: "A. for, B. while, C. do-while, D. foreach",
                    explanation: "Java中的循环结构包括：for循环、while循环、do-while循环和foreach循环（增强for循环）。loop不是Java的关键字。"
                }
            ],
            judge: [
                {
                    question: "Java中一个类可以实现多个接口。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "Java中一个类可以实现多个接口，但只能继承一个类。这是Java实现多重继承的方式。"
                },
                {
                    question: "Java中String类是final的，不能被继承。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "String类被声明为final，因此不能被继承。这是为了确保String对象的不可变性和安全性。"
                },
                {
                    question: "Java中基本数据类型存储在堆内存中。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "基本数据类型的局部变量存储在栈内存中，而对象（包括包装类对象）存储在堆内存中。"
                },
                {
                    question: "Java中==运算符比较的是对象的内容。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "==运算符比较的是对象的引用（内存地址），而不是对象的内容。要比较对象的内容，应该使用equals()方法。"
                },
                {
                    question: "Java中接口可以包含具体的方法实现。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "从Java 8开始，接口可以包含默认方法（default methods）和静态方法，这些方法可以有具体的实现。"
                },
                {
                    question: "Java中finally块中的代码总是会执行。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "finally块中的代码总是会执行，无论是否发生异常。只有在调用System.exit()或JVM崩溃的情况下才不会执行。"
                },
                {
                    question: "Java中抽象类必须包含至少一个抽象方法。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "抽象类可以不包含任何抽象方法，但包含抽象方法的类必须是抽象类。"
                },
                {
                    question: "Java中数组是对象。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "在Java中，数组是对象，它们继承自Object类，并且可以调用Object类的方法，如toString()。"
                },
                {
                    question: "Java中main方法必须是public的。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "main方法必须是public的，这样JVM才能访问它。如果main方法不是public的，程序将无法运行。"
                },
                {
                    question: "Java中所有异常都继承自Throwable类。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "Java中所有异常和错误都继承自Throwable类。Exception和Error是Throwable的两个直接子类。"
                }
            ]
        },
        harmony: {
            single: [
                {
                    question: "鸿蒙OS是哪个公司开发的？",
                    options: ["A. 阿里巴巴", "B. 腾讯", "C. 华为", "D. 百度"],
                    answer: "C. 华为",
                    explanation: "鸿蒙OS（HarmonyOS）是华为公司开发的操作系统，于2019年首次发布。"
                },
                {
                    question: "鸿蒙OS的主要特点是什么？",
                    options: ["A. 分布式架构", "B. 仅限于手机使用", "C. 基于Linux内核", "D. 闭源系统"],
                    answer: "A. 分布式架构",
                    explanation: "鸿蒙OS的主要特点是分布式架构，支持跨设备协同，可以在多种设备上运行，如手机、平板、智能手表等。"
                },
                {
                    question: "鸿蒙OS使用什么开发语言？",
                    options: ["A. Java", "B. Swift", "C. JavaScript", "D. ArkTS"],
                    answer: "D. ArkTS",
                    explanation: "鸿蒙OS主要使用ArkTS语言进行应用开发，它是TypeScript的超集，专为鸿蒙生态设计。"
                },
                {
                    question: "鸿蒙OS的分布式能力基于什么技术？",
                    options: ["A. 微内核", "B. 宏内核", "C. 混合内核", "D. 外核"],
                    answer: "A. 微内核",
                    explanation: "鸿蒙OS使用微内核设计，这使得它具有更好的安全性和分布式能力，能够实现跨设备的无缝协同。"
                },
                {
                    question: "鸿蒙OS的IDE叫什么？",
                    options: ["A. Android Studio", "B. Xcode", "C. DevEco Studio", "D. Harmony IDE"],
                    answer: "C. DevEco Studio",
                    explanation: "DevEco Studio是鸿蒙OS的官方集成开发环境，基于IntelliJ IDEA开发，支持鸿蒙应用开发。"
                },
                {
                    question: "鸿蒙OS支持哪些开发框架？",
                    options: ["A. Java UI", "B. SwiftUI", "C. ArkUI", "D. React Native"],
                    answer: "C. ArkUI",
                    explanation: "鸿蒙OS使用ArkUI作为其声明式开发框架，支持使用ArkTS语言进行UI开发。"
                },
                {
                    question: "鸿蒙OS的应用程序包后缀是什么？",
                    options: ["A. .apk", "B. .app", "C. .hap", "D. .harmony"],
                    answer: "C. .hap",
                    explanation: "鸿蒙OS的应用程序包后缀是.hap（Harmony Ability Package），用于分发和安装鸿蒙应用。"
                },
                {
                    question: "鸿蒙OS的分布式数据管理基于什么？",
                    options: ["A. 分布式数据库", "B. 分布式文件系统", "C. 分布式数据对象", "D. 分布式缓存"],
                    answer: "C. 分布式数据对象",
                    explanation: "鸿蒙OS的分布式数据管理基于分布式数据对象，允许跨设备的数据共享和同步。"
                },
                {
                    question: "鸿蒙OS的安全机制基于什么？",
                    options: ["A. 多重验证", "B. 微内核架构", "C. 硬件加密", "D. 生物识别"],
                    answer: "B. 微内核架构",
                    explanation: "鸿蒙OS的安全机制基于其微内核架构，提供了更高的安全性和隔离性，减少了系统漏洞的风险。"
                },
                {
                    question: "鸿蒙OS支持哪些设备类型？",
                    options: ["A. 仅手机", "B. 手机和平板", "C. 多种智能设备", "D. 仅物联网设备"],
                    answer: "C. 多种智能设备",
                    explanation: "鸿蒙OS支持多种智能设备，包括手机、平板、智能手表、智能电视、车机等，实现全场景智慧体验。"
                }
            ],
            multiple: [
                {
                    question: "鸿蒙OS的分布式能力包括哪些？（多选）",
                    options: ["A. 分布式软总线", "B. 分布式数据管理", "C. 分布式设备虚拟化", "D. 分布式任务调度", "E. 分布式安全"],
                    answer: "A. 分布式软总线, B. 分布式数据管理, C. 分布式设备虚拟化, D. 分布式任务调度, E. 分布式安全",
                    explanation: "鸿蒙OS的分布式能力包括分布式软总线、分布式数据管理、分布式设备虚拟化、分布式任务调度和分布式安全，这些能力共同支持跨设备协同。"
                },
                {
                    question: "鸿蒙OS的开发语言包括哪些？（多选）",
                    options: ["A. Java", "B. C++", "C. ArkTS", "D. JavaScript", "E. Python"],
                    answer: "A. Java, B. C++, C. ArkTS, D. JavaScript",
                    explanation: "鸿蒙OS支持多种开发语言，包括Java、C++、ArkTS和JavaScript。ArkTS是主要的应用开发语言，Java和C++用于底层开发，JavaScript用于Web开发。"
                },
                {
                    question: "鸿蒙OS的UI开发框架有哪些特点？（多选）",
                    options: ["A. 声明式开发", "B. 组件化", "C. 跨设备适配", "D. 动态布局", "E. 实时预览"],
                    answer: "A. 声明式开发, B. 组件化, C. 跨设备适配, D. 动态布局, E. 实时预览",
                    explanation: "鸿蒙OS的UI开发框架（ArkUI）支持声明式开发、组件化、跨设备适配、动态布局和实时预览，提高了开发效率和用户体验。"
                },
                {
                    question: "鸿蒙OS的安全特性包括哪些？（多选）",
                    options: ["A. 微内核架构", "B. 多重验证", "C. 分布式安全", "D. 硬件级安全", "E. 数据加密"],
                    answer: "A. 微内核架构, C. 分布式安全, D. 硬件级安全, E. 数据加密",
                    explanation: "鸿蒙OS的安全特性包括微内核架构、分布式安全、硬件级安全和数据加密，确保了系统和用户数据的安全。"
                },
                {
                    question: "鸿蒙OS支持哪些应用分发方式？（多选）",
                    options: ["A. 应用市场", "B. 直接安装", "C. 跨设备共享", "D. 云端分发", "E. 侧载"],
                    answer: "A. 应用市场, C. 跨设备共享, D. 云端分发",
                    explanation: "鸿蒙OS支持通过应用市场、跨设备共享和云端分发等方式分发应用，提供了灵活的应用获取途径。"
                },
                {
                    question: "鸿蒙OS的跨设备协同能力基于哪些技术？（多选）",
                    options: ["A. 分布式软总线", "B. 设备虚拟化", "C. 能力调度", "D. 统一数据管理", "E. 统一安全机制"],
                    answer: "A. 分布式软总线, B. 设备虚拟化, C. 能力调度, D. 统一数据管理, E. 统一安全机制",
                    explanation: "鸿蒙OS的跨设备协同能力基于分布式软总线、设备虚拟化、能力调度、统一数据管理和统一安全机制，实现了设备间的无缝连接和协同。"
                },
                {
                    question: "鸿蒙OS的开发工具DevEco Studio提供哪些功能？（多选）",
                    options: ["A. 代码编辑", "B. 调试", "C. 性能分析", "D. 跨设备预览", "E. 一键部署"],
                    answer: "A. 代码编辑, B. 调试, C. 性能分析, D. 跨设备预览, E. 一键部署",
                    explanation: "DevEco Studio提供代码编辑、调试、性能分析、跨设备预览和一键部署等功能，支持鸿蒙应用的全程开发。"
                },
                {
                    question: "鸿蒙OS的分布式数据管理支持哪些特性？（多选）",
                    options: ["A. 数据同步", "B. 数据共享", "C. 数据加密", "D. 数据备份", "E. 数据恢复"],
                    answer: "A. 数据同步, B. 数据共享, C. 数据加密, D. 数据备份, E. 数据恢复",
                    explanation: "鸿蒙OS的分布式数据管理支持数据同步、数据共享、数据加密、数据备份和数据恢复等特性，确保了数据的安全和一致性。"
                },
                {
                    question: "鸿蒙OS的设备类型包括哪些？（多选）",
                    options: ["A. 手机", "B. 平板", "C. 智能手表", "D. 智能电视", "E. 车机"],
                    answer: "A. 手机, B. 平板, C. 智能手表, D. 智能电视, E. 车机",
                    explanation: "鸿蒙OS支持多种设备类型，包括手机、平板、智能手表、智能电视和车机等，实现了全场景智慧体验。"
                },
                {
                    question: "鸿蒙OS的开发模式有哪些特点？（多选）",
                    options: ["A. 一次开发", "B. 多端部署", "C. 统一生态", "D. 开放源码", "E. 社区支持"],
                    answer: "A. 一次开发, B. 多端部署, C. 统一生态, D. 开放源码, E. 社区支持",
                    explanation: "鸿蒙OS的开发模式具有一次开发、多端部署、统一生态、开放源码和社区支持等特点，降低了开发成本，提高了开发效率。"
                }
            ],
            judge: [
                {
                    question: "鸿蒙OS是基于Linux内核开发的。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "鸿蒙OS使用微内核设计，不是基于Linux内核。它的微内核架构提供了更好的安全性和分布式能力。"
                },
                {
                    question: "鸿蒙OS支持跨设备协同。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "鸿蒙OS的分布式架构支持跨设备协同，允许不同设备间无缝连接和共享资源。"
                },
                {
                    question: "鸿蒙OS只能运行在华为设备上。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "鸿蒙OS是开源系统，可以运行在多种设备上，不仅限于华为设备。"
                },
                {
                    question: "鸿蒙OS的应用可以使用Java开发。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "鸿蒙OS支持多种开发语言，包括Java、C++、ArkTS和JavaScript，开发者可以根据需要选择合适的语言。"
                },
                {
                    question: "鸿蒙OS的分布式软总线技术实现了设备间的低延迟通信。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "分布式软总线是鸿蒙OS的核心技术之一，实现了设备间的低延迟、高带宽通信，支持跨设备协同。"
                },
                {
                    question: "鸿蒙OS不支持Android应用。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "鸿蒙OS通过兼容层支持Android应用，使得Android应用可以在鸿蒙设备上运行。"
                },
                {
                    question: "鸿蒙OS的ArkTS语言是基于TypeScript的。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "ArkTS是TypeScript的超集，专为鸿蒙生态设计，提供了更好的类型系统和开发体验。"
                },
                {
                    question: "鸿蒙OS的微内核架构提供了更高的安全性。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "微内核架构减少了系统漏洞的风险，提供了更高的安全性和隔离性。"
                },
                {
                    question: "鸿蒙OS不支持多语言开发。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "鸿蒙OS支持多种开发语言，包括ArkTS、Java、C++和JavaScript，满足不同开发需求。"
                },
                {
                    question: "鸿蒙OS的DevEco Studio是基于Visual Studio Code开发的。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "DevEco Studio是基于IntelliJ IDEA开发的，不是基于Visual Studio Code。"
                }
            ]
        },
        android: {
            single: [
                {
                    question: "Android系统是基于什么内核开发的？",
                    options: ["A. Windows NT", "B. Linux", "C. macOS", "D. Unix"],
                    answer: "B. Linux",
                    explanation: "Android系统是基于Linux内核开发的，Linux内核提供了底层的系统服务，如内存管理、进程管理等。"
                },
                {
                    question: "Android应用的主要开发语言是什么？",
                    options: ["A. Swift", "B. Java", "C. C#", "D. Python"],
                    answer: "B. Java",
                    explanation: "Android应用的主要开发语言是Java，不过现在也支持Kotlin和C++。"
                },
                {
                    question: "Android中用于定义用户界面的文件是什么格式？",
                    options: ["A. .java", "B. .xml", "C. .html", "D. .json"],
                    answer: "B. .xml",
                    explanation: "Android中使用XML文件来定义用户界面，这些文件位于res/layout目录下。"
                },
                {
                    question: "Android中用于存储简单数据的关键值对是什么？",
                    options: ["A. SQLiteDatabase", "B. SharedPreferences", "C. File Storage", "D. ContentProvider"],
                    answer: "B. SharedPreferences",
                    explanation: "SharedPreferences用于存储简单的键值对数据，适合存储应用配置和用户偏好设置。"
                },
                {
                    question: "Android中哪个组件用于处理后台任务？",
                    options: ["A. Activity", "B. Service", "C. BroadcastReceiver", "D. ContentProvider"],
                    answer: "B. Service",
                    explanation: "Service是Android的组件之一，用于处理后台任务，如下载文件、播放音乐等。"
                },
                {
                    question: "Android中用于数据库存储的组件是什么？",
                    options: ["A. SharedPreferences", "B. File Storage", "C. SQLiteDatabase", "D. Network Storage"],
                    answer: "C. SQLiteDatabase",
                    explanation: "SQLiteDatabase是Android内置的轻量级数据库，用于存储结构化数据。"
                },
                {
                    question: "Android中哪个方法用于启动一个新的Activity？",
                    options: ["A. startActivity()", "B. launchActivity()", "C. openActivity()", "D. newActivity()"],
                    answer: "A. startActivity()",
                    explanation: "startActivity()方法用于启动一个新的Activity，需要传入一个Intent对象。"
                },
                {
                    question: "Android中用于定义应用清单的文件是什么？",
                    options: ["A. AndroidManifest.xml", "B. Manifest.json", "C. AppManifest.xml", "D. Application.xml"],
                    answer: "A. AndroidManifest.xml",
                    explanation: "AndroidManifest.xml文件包含了应用的基本信息，如包名、组件声明、权限等。"
                },
                {
                    question: "Android中用于处理异步任务的主要类是什么？",
                    options: ["A. Thread", "B. AsyncTask", "C. Handler", "D. Runnable"],
                    answer: "B. AsyncTask",
                    explanation: "AsyncTask是Android中用于处理异步任务的类，它封装了线程和Handler，简化了异步操作。"
                },
                {
                    question: "Android中哪个组件用于响应系统广播？",
                    options: ["A. Activity", "B. Service", "C. BroadcastReceiver", "D. ContentProvider"],
                    answer: "C. BroadcastReceiver",
                    explanation: "BroadcastReceiver用于响应系统广播和应用内广播，如电量变化、网络状态变化等。"
                }
            ],
            multiple: [
                {
                    question: "Android的四大组件包括哪些？（多选）",
                    options: ["A. Activity", "B. Service", "C. BroadcastReceiver", "D. ContentProvider", "E. Intent"],
                    answer: "A. Activity, B. Service, C. BroadcastReceiver, D. ContentProvider",
                    explanation: "Android的四大组件是Activity、Service、BroadcastReceiver和ContentProvider。Intent是用于组件间通信的消息对象，不是组件。"
                },
                {
                    question: "Android中数据存储方式有哪些？（多选）",
                    options: ["A. SharedPreferences", "B. File Storage", "C. SQLiteDatabase", "D. Network Storage", "E. ContentProvider"],
                    answer: "A. SharedPreferences, B. File Storage, C. SQLiteDatabase, D. Network Storage, E. ContentProvider",
                    explanation: "Android提供了多种数据存储方式，包括SharedPreferences、文件存储、SQLite数据库、网络存储和ContentProvider。"
                },
                {
                    question: "Android中用于界面布局的常用组件有哪些？（多选）",
                    options: ["A. LinearLayout", "B. RelativeLayout", "C. FrameLayout", "D. ConstraintLayout", "E. AbsoluteLayout"],
                    answer: "A. LinearLayout, B. RelativeLayout, C. FrameLayout, D. ConstraintLayout, E. AbsoluteLayout",
                    explanation: "Android中常用的布局组件包括LinearLayout、RelativeLayout、FrameLayout、ConstraintLayout和AbsoluteLayout（已废弃）。"
                },
                {
                    question: "Android中用于多线程编程的方式有哪些？（多选）",
                    options: ["A. Thread", "B. AsyncTask", "C. Handler", "D. Runnable", "E. Executor"],
                    answer: "A. Thread, B. AsyncTask, C. Handler, D. Runnable, E. Executor",
                    explanation: "Android中多线程编程可以使用Thread、AsyncTask、Handler、Runnable和Executor等方式。"
                },
                {
                    question: "Android中Intent可以传递哪些类型的数据？（多选）",
                    options: ["A. 基本数据类型", "B. 字符串", "C. 序列化对象", "D. Bundle", "E. 文件路径"],
                    answer: "A. 基本数据类型, B. 字符串, C. 序列化对象, D. Bundle, E. 文件路径",
                    explanation: "Intent可以传递基本数据类型、字符串、序列化对象、Bundle和文件路径等数据，用于组件间通信。"
                },
                {
                    question: "Android中常用的资源类型有哪些？（多选）",
                    options: ["A. 布局资源", "B. 字符串资源", "C. 图片资源", "D. 颜色资源", "E. 样式资源"],
                    answer: "A. 布局资源, B. 字符串资源, C. 图片资源, D. 颜色资源, E. 样式资源",
                    explanation: "Android中常用的资源类型包括布局资源、字符串资源、图片资源、颜色资源和样式资源等，这些资源都放在res目录下。"
                },
                {
                    question: "Android中用于网络通信的方式有哪些？（多选）",
                    options: ["A. HttpURLConnection", "B. HttpClient", "C. Volley", "D. Retrofit", "E. OkHttp"],
                    answer: "A. HttpURLConnection, B. HttpClient, C. Volley, D. Retrofit, E. OkHttp",
                    explanation: "Android中网络通信可以使用HttpURLConnection、HttpClient（已废弃）、Volley、Retrofit和OkHttp等库。"
                },
                {
                    question: "Android中用于本地化支持的方式有哪些？（多选）",
                    options: ["A. 资源目录后缀", "B. 多语言字符串", "C. 区域设置", "D. 自动翻译", "E. 系统设置"],
                    answer: "A. 资源目录后缀, B. 多语言字符串, C. 区域设置, E. 系统设置",
                    explanation: "Android通过资源目录后缀（如values-zh）、多语言字符串、区域设置和系统设置来支持本地化。"
                },
                {
                    question: "Android中用于性能优化的工具有哪些？（多选）",
                    options: ["A. Profiler", "B. Lint", "C. Traceview", "D. Systrace", "E. Hierarchy Viewer"],
                    answer: "A. Profiler, B. Lint, C. Traceview, D. Systrace, E. Hierarchy Viewer",
                    explanation: "Android提供了Profiler、Lint、Traceview、Systrace和Hierarchy Viewer等工具用于性能分析和优化。"
                },
                {
                    question: "Android中支持的通知类型有哪些？（多选）",
                    options: ["A. 普通通知", "B. 进度通知", "C. 大图通知", "D. 悬挂通知", "E. 分组通知"],
                    answer: "A. 普通通知, B. 进度通知, C. 大图通知, D. 悬挂通知, E. 分组通知",
                    explanation: "Android支持多种通知类型，包括普通通知、进度通知、大图通知、悬挂通知和分组通知，丰富了通知的展示方式。"
                }
            ],
            judge: [
                {
                    question: "Android应用必须有一个主Activity作为入口点。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "每个Android应用必须有一个主Activity作为入口点，它在AndroidManifest.xml中通过<intent-filter>标记为LAUNCHER。"
                },
                {
                    question: "Android中的Service可以运行在主线程中。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "Service默认运行在主线程中，如果需要执行耗时操作，应该在Service中创建新线程或使用IntentService。"
                },
                {
                    question: "Android中的BroadcastReceiver可以更新UI。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "BroadcastReceiver通常运行在主线程中，但不应在其中执行耗时操作或直接更新UI，应该通过Handler或启动Activity来更新UI。"
                },
                {
                    question: "Android中的ContentProvider用于共享数据 between applications.",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "ContentProvider用于在不同应用间共享数据，提供了一套标准接口来访问数据。"
                },
                {
                    question: "Android中的Fragment必须依赖于Activity存在。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "Fragment是Activity的一部分，必须依赖于Activity存在，不能独立运行。"
                },
                {
                    question: "Android中的AsyncTask已被废弃。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "从Android 11开始，AsyncTask已被废弃，推荐使用java.util.concurrent或Kotlin协程来处理异步任务。"
                },
                {
                    question: "Android中的Intent可以用于启动组件和传递数据。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "A. 正确",
                    explanation: "Intent用于启动Activity、Service、BroadcastReceiver等组件，并可以在组件间传递数据。"
                },
                {
                    question: "Android中的ListView比RecyclerView更高效。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "RecyclerView比ListView更高效和灵活，它提供了更好的性能和更多的布局选项，是推荐使用的列表组件。"
                },
                {
                    question: "Android中的SharedPreferences适合存储大量数据。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "SharedPreferences适合存储简单的键值对数据，不适合存储大量数据，大量数据应该使用数据库或文件存储。"
                },
                {
                    question: "Android应用可以在没有权限的情况下访问网络。",
                    options: ["A. 正确", "B. 错误"],
                    answer: "B. 错误",
                    explanation: "Android应用需要INTERNET权限才能访问网络，必须在AndroidManifest.xml中声明该权限。"
                }
            ]
        }
    };

    // 当前状态
    let currentTech = 'java';
    let currentType = 'single';
    let currentQuestionIndex = 0;

    // DOM元素
    const techButtons = document.querySelectorAll('.tech-btn');
    const typeItems = document.querySelectorAll('.question-type li');
    const prevBtn = document.getElementById('prev-btn');
    const nextBtn = document.getElementById('next-btn');
    const currentQuestionEl = document.getElementById('current-question');
    const totalQuestionsEl = document.getElementById('total-questions');
    const questionContainer = document.getElementById('question-container');

    // 初始化
    function init() {
        // 技术方向选择
        techButtons.forEach(button => {
            button.addEventListener('click', () => {
                const tech = button.getAttribute('data-tech');
                techButtons.forEach(btn => btn.classList.remove('active'));
                button.classList.add('active');
                currentTech = tech;
                currentQuestionIndex = 0;
                renderQuestion();
            });
        });

        // 题型选择
        typeItems.forEach(item => {
            item.addEventListener('click', () => {
                const type = item.getAttribute('data-type');
                typeItems.forEach(i => i.classList.remove('active'));
                item.classList.add('active');
                currentType = type;
                currentQuestionIndex = 0;
                renderQuestion();
            });
        });

        // 上一题按钮
        prevBtn.addEventListener('click', () => {
            if (currentQuestionIndex > 0) {
                currentQuestionIndex--;
                renderQuestion();
            }
        });

        // 下一题按钮
        nextBtn.addEventListener('click', () => {
            const questions = questionBank[currentTech][currentType];
            if (currentQuestionIndex < questions.length - 1) {
                currentQuestionIndex++;
                renderQuestion();
            }
        });

        // 初始渲染
        renderQuestion();
    }

    // 渲染题目
    function renderQuestion() {
        const questions = questionBank[currentTech][currentType];
        const question = questions[currentQuestionIndex];

        // 更新题目计数
        currentQuestionEl.textContent = currentQuestionIndex + 1;
        totalQuestionsEl.textContent = questions.length;

        // 更新按钮状态
        prevBtn.disabled = currentQuestionIndex === 0;
        nextBtn.disabled = currentQuestionIndex === questions.length - 1;

        // 生成选项HTML
        let optionsHtml = '';
        question.options.forEach(option => {
            optionsHtml += `<li>${option}</li>`;
        });

        // 生成题目HTML
        const questionHtml = `
            <div class="question-card">
                <div class="question-title">${currentQuestionIndex + 1}. ${question.question}</div>
                <ul class="options">${optionsHtml}</ul>

                <div class="answer-section">
                    <div class="answer-title">答案：${question.answer}</div>
                    <div class="explanation">
                        <p><strong>解析：</strong></p>
                        <p>${question.explanation}</p>
                    </div>
                </div>
            </div>
        `;

        questionContainer.innerHTML = questionHtml;

        // 添加选项点击事件
        const optionItems = questionContainer.querySelectorAll('.options li');
        optionItems.forEach(item => {
            item.addEventListener('click', () => {
                optionItems.forEach(opt => opt.classList.remove('selected'));
                item.classList.add('selected');
            });
        });
    }

    // 启动应用
    init();
</script>
</body>
</html>



